<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>邀请您的好友加入我们</title>
<script type="text/javascript">
	Invite = {
		totalInvite : 1,
		click : function(obj) {
			if (obj.value == '请输入您好友的E-mail') {
				obj.value = '';
			}
		},
		blur : function(obj) {
			var error = document.getElementById(obj.id + "Error");
			if (obj.value == '') {
				obj.value = '请输入您好友的E-mail';
			} else {
				Invite.checkEmail(obj.value, error);
			}
		},
		checkEmail : function(email, error) {
			var pattern = /^([a-zA-Z0-9._-])+@([a-zA-Z0-9_-])+(\.[a-zA-Z0-9_-])+/;
			if (!pattern.test(email)) {
				if (error != null) {
					error.innerHTML = "E-mail格式不正确";
					error.style.display = "";
				}
				return false;
			} else {
				if (error != null) {
					error.style.display = "none";
				}
				return true;
			}
		},
		addEmail : function() {
			var emailsTable = document.getElementById("emailsTable");
			var tr = emailsTable.insertRow(-1);
			var date = new Date();
			var time = date.getTime() + Invite.totalInvite;
			var input = "<input type='text' id='email"
					+ time
					+ "' name='emails' size='40' value='请输入您好友的E-mail' onclick='Invite.click(this)' onblur='Invite.blur(this)'/>";
			tr.insertCell(-1).innerHTML = input;
			var button = "<input type='button' class='deleteBtn' value='取消' onclick='Invite.removeEmail(this)'/>"
			tr.insertCell(-1).innerHTML = button;
			var font = "<font id='email"+time+"Error'' style='display:none'></font>";
			tr.insertCell(-1).innerHTML = font;
			Invite.totalInvite++;
			var totalInvite = document.getElementById("totalInvite");
			totalInvite.innerHTML = Invite.totalInvite;
			//var totalInviteCount = document.getElementById("totalInviteCount");
			//totalInviteCount.value = Invite.totalInvite;
		},
		removeEmail : function(obj) {
			var tr = obj.parentNode.parentNode;
			tr.parentNode.removeChild(tr);
			Invite.totalInvite--;
			var totalInvite = document.getElementById("totalInvite");
			totalInvite.innerHTML = Invite.totalInvite;
			//var totalInviteCount = document.getElementById("totalInviteCount");
			//totalInviteCount.value = Invite.totalInvite;
		},
		submit : function() {
			var emails = document.getElementsByName("emails");
			var valideEmailCount = 0;
			for ( var i = 0; i < emails.length; i++) {
				var email = emails[i].value;
				var result = Invite.checkEmail(email, null);
				if (result == true) {
					valideEmailCount++;
				}
			}
			var valideEmailCountInput = document.getElementById("valideEmailCount");
			valideEmailCountInput.value=valideEmailCount;
			//alert(valideEmailCountInput.value);
			if (valideEmailCount == 0) {
				alert("对不起!您还没有输入一个有效的E-mail地址。谢谢!");
				return false;
			}else{
				var form=document.getElementById("form");
				form.submit();
			}

		}
	}
</script>
</head>
<body>
	你将向
	<font id="totalInvite">1</font>个好友发出邀请
	<form action="${pageContext.request.contextPath}/invite/joinUs.html" id="form" method="post">
	<input type="button" onclick="Invite.addEmail()" value="增加邀请" />
	<input id="valideEmailCount" name="valideEmailCount" type="hidden" value="0">
	<table id="emailsTable">
		<tr>
			<td>
				<input type="text" id="email" name="emails" size="40" value="请输入您好友的E-mail" onclick="Invite.click(this)" onblur="Invite.blur(this)">
			</td>
			<td></td>
			<td>
				<font id="emailError" style='display: none'></font>
			</td>
		</tr>
	</table>
	<input type="button" value="提交" onclick="Invite.submit()">
	</form>
</body>
</html>